<template>
    <a-drawer width="100%" :visible="visible" :body-style="{ paddingBottom: '80px', background: '#f0f2f5' }"
        placement="right" :get-container="false" :style="{ position: 'absolute'}"   :closable="false"
        :footer-style="{ textAlign: 'right' }">
        <a-card class="mb-2 text-center">
            <a-row :gutter="24">
                <a-col :span="20">
                    <div class=" mb-2 text-left font-semibold  text-lg ml-6 flex flex-row"
                        style="font-weight: 600;font-size: 16px;">
                        收票记录
                    </div>
                    <div class="flex flex-row">
                        <div class="w-32 ">
                            <div class="mb-2">项目编号</div>
                            <div style="font-weight: 600;">{{ info.proCode }}</div>
                        </div>
                        <div class="w-40 ">
                            <div class="mb-2">项目名称</div>
                            <div style="font-weight: 600;">{{ info.proName }}</div>
                        </div>
                        <div class="w-40 ">
                            <div class="mb-2">开票金额</div>
                            <div style="font-weight: 600;">{{ info.amount }}</div>
                        </div>

                        <div class="w-32  ">
                            <div class="mb-2">登记人</div>
                            <div style="font-weight: 600;">{{ info.createUserName }}</div>
                        </div>

                        <div class="w-32   ">
                            <div class="mb-2">开票日期</div>
                            <div style="font-weight: 600;">{{ info.createTime }}</div>
                        </div>
                        <div class="w-32">
                            <div class="mb-2">所属部门</div>
                            <div style="font-weight: 600;">{{ info.orgName }}</div>
                        </div>
                    </div>
                </a-col>
                <a-col :span="4" class="text-right">
                    <a-button @click="onClose">返回</a-button>
                </a-col>
            </a-row>
        </a-card>
        <a-card class="mb-2">

            <a-tabs v-model:activeKey="activeKey">
                <a-tab-pane key="1" tab="详细信息">
                    <edit ref="editRef" :disabled="true"></edit>
                </a-tab-pane>
                <!-- <a-tab-pane key="2" tab="审核流程">
                审核流程
                </a-tab-pane> -->
            </a-tabs>
        </a-card>

    </a-drawer>
</template>

<script setup>
import edit from '@/views/flw/customform/finance/components/payment/edit.vue'
const visible = ref(false)
const activeKey = ref('1')

const emits = defineEmits(['OnClose'])
const onClose = () => {
    visible.value = false;
    emits('OnClose', '')
};
const info = ref({})
const editRef = ref({})


const show = (record) => {
    visible.value = true
    editRef.value.show(record)
    info.value = { ...record }
}
defineExpose({
    show
});

</script>
